﻿/// <reference path="../../JQ/jquery-1.10.2.js" />
/// <reference path="../../JQ/Plugins/JQDD/JQDD.js" />
/// <reference path="Controls/ControlManager.js" />
/// <reference path="Controls/ControlType.js" />
/// <reference path="../../JQ/My/JQExtend.js" />
/// <reference path="../../MyJS/MyString.js" />
/// <reference path="../../JQ/My/JQMove.js" />
/// <reference path="ControlProperty.js" />
/// <reference path="../../JQ/Controls/Contextmenu/contextmenu.js" />

var DesignerZone = function (el) {
    this.focusEl = null;//获取焦点的对象
    //保留jq对象
    this.el = null;
    this.init(el);
};

DesignerZone.prototype.init = function (el) {
    /// <summary>初始化设计区域</summary>
    el = $.getJQObj(el);
    if (el === null) return;
    this.el = el;
    var me = this;
    //绑定移动控件的释放控件前触发的事件
    $(document).bind('beforeCancelMove', { DesignerZone: me }, function (event, e) {
        var moveEl = JQMove.data.followEl || JQMove.data.moveEl;
        if (!moveEl) return;
        var moveObj = $(moveEl);
        //必须要先隐藏再显示出来，才可以根据坐标获取合适的父元素，否则或者到的父元素是自己，所以无法拖动改变父元素
        moveObj.hide();
        var oParent = $.elementFromPoint(e.pageX, e.pageY);
        moveObj.show();
        if (oParent && event.data.DesignerZone.isInDesignerZone(oParent) && jQuery.canAppendChild(oParent)) {
            var parentOffset = $(oParent).offset();
            var oldParent = moveObj.parent().first();
            //计算新的父控件与旧的父控件的便宜位置
            var newOffsetX = 0, newOffsetY = 0;
            //计算偏移父控件的位置
            if (oldParent.length === 1 && oldParent[0].id !== $(oParent)[0].id) {
                var oldParentOffset = oldParent.offset();
                newOffsetX = oldParentOffset.left + $(oParent).scrollLeft() - parentOffset.left - $(oldParent).scrollLeft();
                newOffsetY = oldParentOffset.top + $(oParent).scrollTop() - parentOffset.top - $(oldParent).scrollTop();

                var moveObjTop = parseInt(MyString.leftOfLast(moveObj.css('top'), 'px'));
                var moveObjLeft = parseInt(MyString.leftOfLast(moveObj.css('left'), 'px'));
                //window.status = moveObjLeft + "," + moveObjTop + ',' + (moveObjTop + newOffsetY);
                //moveObj.appendTo(oParent);
                moveObj.appendTo(oParent).css({
                    'top': moveObjTop + newOffsetY,
                    'left': moveObjLeft + newOffsetX
                });
            }
        }
        //重新获得焦点，使得拖动元素的样式不变
        $(moveEl).focus();
    });
};

DesignerZone.prototype.changeParentNode = function () {
    /// <summary>更新dom元素的父节点</summary>

};

DesignerZone.prototype.createControl = function (ctype, x, y) {
    /// <summary>在投放的位置上面创建一个控件</summary>
    /// <param name="ctype" type="String">控件的类型</param>
    /// <param name="x" type="Int">位置的X坐标（相对文档的X坐标）</param>
    /// <param name="y" type="Int">位置的Y坐标（相对文档的Y坐标）</param>
    var oControl = ControlManager.create(ctype, ControlProperty.getDesignConfig(ctype));
    var oParent = $.elementFromPoint(x, y);
    if (oParent && this.isInDesignerZone(oParent) && jQuery.canAppendChild(oParent)) {
        var parentOffset = $(oParent).offset();
        //还要加上卷起的高度和宽度
        var newX = x - parentOffset.left + $(oParent).scrollLeft();
        var newY = y - parentOffset.top + $(oParent).scrollTop();
        var sMsg = "({0},{1})，tagName={2},id={3}";
        window.status = MyString.format(sMsg, newX, newY, oParent.tagName, oParent.id);
        //绑定右键事件（删除对象）
        oControl.appendTo(oParent, newX, newY).contextmenu({
            items: [{ text: '移除元素', action: function () {
                $(this).remove();
            }
            }],
            width: '150px'
        }).bind('mousedown', { DZ: this }, function (e) {
            e.data.DZ.focusEl = this;
            $(e.data.DZ).trigger("focusElChange", e.data.DZ.focusEl);
        });
        return true;
    }
    return false;
};

DesignerZone.prototype.isInDesignerZone = function (oParent) {
    /// <summary>验证parent对象是否处在设计区域中</summary>
    /// <param name="oParent" type="DomObject">父对象</param>
    if ($(oParent)[0] && $(oParent)[0].id === this.el[0].id) return true;
    var tagName = this.el[0].tagName,
        id = this.el[0].id;
    if ($(oParent).parent('#' + id).length === 1) {
        return true;
    }
    return false;
};

DesignerZone.prototype.getDesignData = function () {
    /// <summary>获取设计的数据</summary>
    return $(this.el).html();
};
